<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html >
<head>
<title>jQuery</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="/${initParam.context_root }/script/jquery.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
	
		$("#jsonBtn").on("click", function(){
			/*
			/jQuery_class_stu/jQueryServlet요청
			cmd - getMemberByIdJSON, id - 입력된 값
			요청방식 - POST
			응답 데이터 타입 - JSON
			*/
			$.ajax({
				"url":"/${initParam.context_root }/member/searchMemberById.do",
				type:"POST",
				data:{id:$("#id").val()},
				dataType:"JSON",
				error:errorMethod,
				success:function(json){ //$.ajax에서 dataType을 JSON으로 주면 서버에서 넘어
					//alert(json);
					//alert(json.member.id+"-"+json.member.name);
					//$("#layer").html(json.member.id+"-"+json.member.name);
					alert(json.id+json.name);
					$("#layer").html(json.id+"-"+json.name+", 가입일 : " + json.joinDate);
				},
				beforeSend:checkId
			});
		});
	});
	function checkId(){
		//if($("#id").val().length==0)
		//!id=true = 0
			if(!$("#id").val()){
				alert("조회할 ID를 넣으세요");
				$("#id").val("").focus();
				return false;//false를 return 하면 서버로 요청이 안된다.
				 
			
		}
	}
	/* 
	ajax()의 error프라퍼티에 등록할 함수.
	매개변수 (모두생략가능)
	1. XMLHttpRequest 객체
	2. 응답 코드 메세지(success,error)
	3. 에러메세지
	*/
	
	function errorMethod(){
		alert("요청시 오류 발생");
	}
</script>
     
</head>
<body>    
<form>
	ID : <input type="text" name="id" id="id">
	<input type="button" value="json전송" id="jsonBtn">
</form>
<div id="layer"></div>
</body>
</html>











